<ng-container *ngIf="onlyPic; then pic else picAndContent"></ng-container>
<ng-template #pic>
  <ng-container *ngIf="charaInfo; then exit else temp"></ng-container>
  <ng-template #exit>
    <div class="icon-div">
      <div class="icon-before"></div>
      <img
        class="icon"
        [style.background]="charaInfo!.bgImg"
        [src]="charaInfo!.iconImg"
        loading="lazy"
        appImgLoadAndErrorHandle
      />
      <img class="icon-after" [src]="charaInfo!.elementSvg" loading="lazy" appImgErrorHandle />
    </div>
  </ng-template>
  <ng-template #temp>
    <div class="icon-div">
      <div class="icon-before"></div>
      <img class="icon" [style.background]="tempQualityBG" [src]="tempPicUrl" loading="lazy" />
      <!-- <img class="icon-after" [src]="charaInfo.elementSvg" loading="lazy" appImgErrorHandle> -->
    </div>
  </ng-template>
</ng-template>
<ng-template #picAndContent>
  <div class="block">
    <div class="icon-div">
      <div class="icon-before"></div>
      <img
        class="icon"
        [style.background]="charaInfo!.bgImg"
        [src]="charaInfo!.iconImg"
        loading="lazy"
        appImgLoadAndErrorHandle
      />
      <img class="icon-after" [src]="charaInfo!.elementSvg" loading="lazy" appImgErrorHandle />
    </div>
    <span class="name" [innerText]="charaInfo!.names[currentLanguage]"></span>
    <span class="spacer"></span>
    <figure *ngIf="charaInfo!.isEnkaData" class="shinshinmoe"></figure>
  </div>
</ng-template>
